﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title></title>
		<meta charset="UTF-8"/>
		<base target="_self" />
		<script language="JavaScript" src="../../Comm/JScript.js" type="text/javascript" ></script>
		<script type="text/javascript" src="../../Scripts/QueryString.js"></script>
		<script type="text/javascript" src="../../Scripts/config.js"></script>
		<link rel="stylesheet" type="text/css" href="../../Scripts/easyUI145/themes/default/easyui.css" />
		<link rel="stylesheet" type="text/css" href="../../Scripts/easyUI145/themes/icon.css" />
		<script type="text/javascript" src="../../Scripts/easyUI145/jquery.min.js"></script>
		<script type="text/javascript" src="../../Scripts/easyUI145/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="../../Scripts/easyUI145/locale/easyui-lang-zh_CN.js"></script>
		<script type="text/javascript" src="../../Scripts/EasyUIUtility.js"></script>
		<script type="text/javascript">
			function loadViewGrid(json) {
				if ($.isArray(json)) {
					$("#viewGrid").datagrid("loadData", json);
				}
			}
			function addSelectedData(globalSelectedRows, selectedRows) {
				if (!$.isArray(globalSelectedRows) || !$.isArray(selectedRows)) {
					return;
				}
				$.each(selectedRows, function (i, o) {
					var sel = $.grep(globalSelectedRows, function (obj) {
						return obj.No == o.No;
					});
					if (sel.length == 0) {
						globalSelectedRows.push(o);
					}
				});
			}
			function removeSelectedData(globalSelectedRows, selectedRows) {
				if (!$.isArray(globalSelectedRows) || !$.isArray(selectedRows)) {
					return;
				}
				$.each(selectedRows, function (i, o) {
					for (var index = 0; index < globalSelectedRows.length; index++) {
						if (o.No == globalSelectedRows[index].No) {
							globalSelectedRows.splice(index, 1);
							break;
						}
					}
				});
			}
			function loadSelectGrid(url, id, selectedRows) {
				url = url.replace("@Key", id);
				$.ajax({
					type: 'post',
					async: true,
					url: url + "&m=" + Math.random(),
					dataType: 'html',
					success: function (data) {
						if (data.indexOf("err@") != -1) {
							alert(data);
							return;
						}
						var json = JSON.parse(data);
						if ($.isArray(selectedRows)) {
							$.each(json, function (i, o) {
								var sel = $.grep(selectedRows, function (obj) {
									return o.No == obj.No;
								});
								if (sel.length > 0) {
									o.checked = true;
								}
							});
						}
						$("#selectGrid").datagrid("loadData", json);
					}
				});
			}
			function findChildren(jsonArray, parentNo) {
				var appendToTree = function (treeToAppend, child) {
					$.each(treeToAppend, function (i, o) {
						if (o.id == child.ParentNo) {
							o.children.push({
								"id" : child.No,
								"text" : child.Name,
								"children" : []
							});
						} else {
							appendToTree(o.children, child);
						}
					});
				};
				var jsonTree = [];
				if ($.isArray(jsonArray) && typeof parentNo !== "undefined") {
					$.each(jsonArray, function (i, o) {
						if (o.ParentNo == parentNo) {
							jsonTree.push({
								"id" : o.No,
								"text" : o.Name,
								"children" : []
							});
						} else {
							appendToTree(jsonTree, o);
						}
					});
				}
				return jsonTree;
			}
			function loadTree(treeUrl, global) {
				$.ajax({
					type: 'post',
					async: true,
					url: treeUrl + "&m=" + Math.random(),
					dataType: 'html',
					success: function (data) {
						if (data.indexOf("err@") != -1) {
							alert(data);
							return;
						}
						var rootNo = GetQueryString("rootNo");
						var jsonTree = findChildren(JSON.parse(data), rootNo);
						$("#tree").tree("loadData", jsonTree);
					}
				});
			}
			$(function () {
				var global = window;
				global.selectedRows = [];	
				var treeClickUrl = GetQueryString("treeClickUrl");
				if (typeof treeClickUrl === "string") {
					treeClickUrl = unescape(treeClickUrl);
				}
				// tree
				$("#tree").tree({
					checkbox : false,
					onClick : function (node) {
						loadSelectGrid(treeClickUrl, node.id, global.selectedRows);
					}
				});
				var treeUrl = GetQueryString("treeUrl");
				if (treeUrl) {
					loadTree(unescape(treeUrl), global);
				}
				// grid1
				$("#selectGrid").datagrid({
					"onCheck" : function (rowIndex, rowData) {
						addSelectedData(global.selectedRows, [ rowData ]);
						loadViewGrid(global.selectedRows);
					},
					"onUncheck" : function (rowIndex, rowData) {
						removeSelectedData(global.selectedRows, [ rowData ]);
						loadViewGrid(global.selectedRows);
					},
					"onCheckAll" : function (rows) {
						addSelectedData(global.selectedRows, rows);
						loadViewGrid(global.selectedRows);
					},
					"onUncheckAll" : function (rows) {
						removeSelectedData(global.selectedRows, rows);
						loadViewGrid(global.selectedRows);
					}
				});
				
			});
		</script>
	<head>
	<body class="easyui-layout">
		<div data-options="region:'north'" style="height:100px;">
			
		</div>
		<div class="easyui-layout" data-options="region:'center'" border="false">
			<div data-options="region:'west',title:'权限部门档案'" style="width:250px;">
				<ul id="tree" class="easyui-tree"></ul>
			</div>
			<div class="easyui-layout" data-options="region:'center'" border="false">
				<div data-options="region:'north'" border="false" style="height:50%;">
					<table id="selectGrid" class="easyui-datagrid" data-options="fit:true,fitColumns:true,singleSelect:false,rownumbers:true">
						<thead>
							<tr>
								<th data-options="field:'Checked',checkbox:true"></th>
								<th data-options="field:'No',width:80">员工号</th>
								<th data-options="field:'Name',width:150">姓名</th>
							</tr>
						</thead>
					</table>
				</div>
				<div data-options="region:'center'" border="false">
					<table id="viewGrid" class="easyui-datagrid" data-options="fit:true,fitColumns:true,singleSelect:true,rownumbers:true">
						<thead>
							<tr>
								<th data-options="field:'No',width:80">员工号</th>
								<th data-options="field:'Name',width:150">姓名</th>
							</tr>
						</thead>
					</table>
				</div>
			</div>
		</div>
	</body>
</html>